<!DOCTYPE html>
<html lang="en">

<head>
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta charset="utf-8">
    <title>home</title>
    <meta name="keywords" />
    <meta name="description" />
    <meta name="format-detection" content="telephone=no">
    <link rel="shortcut icon" href="./images/zh_CN.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/animate.min.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/aos.css">
    <link rel="stylesheet" href="./css/swiper.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="home">

        <div class="header">
            <a href="index.html" class="logo">
                <img src="./images/logo.png" alt="">
            </a>
            <div class="links f_18">
                <a href="./about.html">about</a>
                <a href="./products.html">products</a>
                <a href="./solutions.html">solutions</a>
                <a href="./cases.html">cases</a>
                <a href="./contact.html">contact</a>
            </div>
        </div>


        <div class="pheader">
            <div class="menu">
                <div class="l">
                    <a href="./index.html" target="_self" class="animated fadeInUpLeft">
                        <img src="./images/logo.png" alt="">
                    </a>
                </div>
                <div class="navbox">
                    <div class="line"></div>
                    <div class="line"></div>
                    <div class="line"></div>
                </div>
            </div>
        </div>

        <div class="menuList">
            <div class="item">
                <div class="tb">
                    <a href="./index.html">Home</a>
                </div>
            </div>
            <div class="item">
                <div class="tb">
                    <a href="./about.html">about</a>
                </div>
            </div>
            <div class="item">
                <div class="tb">
                    <a href="./products.html">
                        products
                    </a>
                </div>
            </div>
            <div class="item">
                <div class="tb">
                    <a href="./solutions.html">
                        solutions
                    </a>
                </div>
            </div>
            <div class="item">
                <div class="tb">
                    <a href="./cases.html">
                        cases
                    </a>
                </div>
            </div>
            <div class="item">
                <div class="tb">
                    <a href="./contact.html">
                        contact
                    </a>
                </div>
            </div>
        </div>


        <div class="bg1">
            <img src="./images/in_bg1.png" alt="">
        </div>
        <div class="bg2">
            <img src="./images/in_bg2.png" alt="">
        </div>

        <div class="bg3">
            <img src="./images/in_bg3.png" alt="">
        </div>
        <div class="bg4">
            <img src="./images/in_bg4.png" alt="">
        </div>
        <div class="bg5">
            <img src="./images/in_bg5.png" alt="">
        </div>
        <div class="bg6">
            <img src="./images/in_bg6.png" alt="">
        </div>

        <div class="main">
            <div class="section1">
                <div class="display">
                    <div class="l" aos="scale-opacity">
                        <div class="l_list on">
                            <div class="title f_96">
                                Deep integration <br>of technology<br> and culture
                            </div>
                            <div class="p2 f_24">Take technological innovation as the core driving force</div>
                            <a href="" class="common_more f_18">explore</a>
                        </div>
                        <div class="l_list">
                            <div class="title f_96">
                                Deep integration <br>of technology<br> and culture
                            </div>
                            <div class="p2 f_24">Take technological innovation as the core driving force</div>
                            <a href="" class="common_more f_18">explore</a>
                        </div>
                        <div class="l_list">
                            <div class="title f_96">
                                Deep integration <br>of technology<br> and culture
                            </div>
                            <div class="p2 f_24">Take technological innovation as the core driving force</div>
                            <a href="" class="common_more f_18">explore</a>
                        </div>
                    </div>
                    <div class="r" aos="scale-opacity">
                        <div class="rSwiper swiper-container">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide">
                                    <img src="./images/in1.png" alt="">
                                </div>
                                <div class="swiper-slide">
                                    <img src="./images/in1.png" alt="">
                                </div>
                                <div class="swiper-slide">
                                    <img src="./images/in1.png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="swiper-pagination"></div>
            </div>
            <div class="section2">
                <div class="top">
                    <div class="img" aos="scale-opacity">
                        <img src="./images/in.png" alt="">
                    </div>
                    <div class="text" aos="scale-opacity">
                        <div class="p1 f_48">the road to future library</div>
                        <div class="p2 f_24">
                            <div class="list">
                                <span></span>
                                <p>Take technological innovation as the core driving force</p>
                            </div>
                            <div class="list">
                                <span></span>
                                <p>Deep integration of technology and culture</p>
                            </div>
                            <div class="list">
                                <span></span>
                                <p>Efficient, convenient, intelligent</p>
                            </div>
                        </div>
                        <a href="" class="common_more f_18">explore</a>
                    </div>
                </div>
                <div class="content">
                    <div class="headline" aos="scale-opacity">
                        <div class="p1 f_48">Solutions</div>
                        <div class="p2 f_24">
                            Utilizing advanced coding technology, this solution supports the construction of clustered library systems, enabling comprehensive management across multiple libraries.
                        </div>
                        <a href="solutions.html" class="common_more f_18">explore</a>
                    </div>
                    <div class="flex">
                        <a href="solution_info.html" class="item" aos="blur">
                            <div>
                                <div class="p1">
                                    Unmanned <br>
                                    supermarket
                                </div>
                                <div class="more">
                                    <p class="f_18">Explore</p>
                                    <svg xmlns="http://www.w3.org/2000/svg" width="15" height="13" viewBox="0 0 15 13" fill="none">
                                        <path d="M0.710938 6.71582H13.233" stroke="black"/>
                                        <path d="M8.22363 0.455078L13.8586 6.7161L8.22363 12.351" stroke="black"/>
                                    </svg>
                                </div>
                                <div class="img">
                                    <img src="./images/in2.png" alt="">
                                </div>
                            </div>
                        </a>
                        <a href="solution_info.html" class="item" aos="blur">
                           <div>
                               <div class="p1">
                                   Contactless payment<br>
                                   vending machine
                               </div>
                               <div class="more">
                                   <p class="f_18">Explore</p>
                                   <svg xmlns="http://www.w3.org/2000/svg" width="15" height="13" viewBox="0 0 15 13" fill="none">
                                       <path d="M0.710938 6.71582H13.233" stroke="black"/>
                                       <path d="M8.22363 0.455078L13.8586 6.7161L8.22363 12.351" stroke="black"/>
                                   </svg>
                               </div>
                               <div class="img">
                                   <img src="./images/in3.png" alt="">
                               </div>
                           </div>
                        </a>
                        <a href="solution_info.html" class="item" aos="blur">
                           <div>
                               <div class="p1">
                                   asset <br>
                                   Management
                               </div>
                               <div class="more">
                                   <p class="f_18">Explore</p>
                                   <svg xmlns="http://www.w3.org/2000/svg" width="15" height="13" viewBox="0 0 15 13" fill="none">
                                       <path d="M0.710938 6.71582H13.233" stroke="black"/>
                                       <path d="M8.22363 0.455078L13.8586 6.7161L8.22363 12.351" stroke="black"/>
                                   </svg>
                               </div>
                               <div class="img">
                                   <img src="./images/in4.png" alt="">
                               </div>
                           </div>
                        </a>
                    </div>
                </div>
            </div>
            <div class="section3">
                <h1 class="f_48" aos="scale-opacity">Products</h1>
                <div class="flex flex1">
                    <div class="img" aos="scale-opacity">
                        <img src="./images/flex1.png" alt="">
                    </div>
                    <div class="r" aos="scale-opacity">
                        <div class="p1 f_48">Library BMS Apps & Softwares</div>
                        <div class="p2 f_24">Based on Microservices Architecture</div>
                        <div class="p3 f_20">
                            Utilizing advanced coding technology, this solution supports the construction of clustered library systems, enabling comprehensive management across multiple libraries.
                        </div>
                        <a href="proInfo.html" class="common_more f_18">explore</a>
                    </div>
                </div>
                <div class="flex flex2">
                    <div class="img" aos="scale-opacity">
                        <img src="./images/flex2.png" alt="">
                    </div>
                    <div class="r" aos="scale-opacity">
                        <div class="p1 f_48">Intelligent Terminals</div>
                        <div class="p2 f_24">Based on Microservices Architecture</div>
                        <div class="p3 f_20">
                            Utilizing advanced coding technology, this solution supports the construction of clustered library systems, enabling comprehensive management across multiple libraries.
                        </div>
                        <a href="proInfo.html" class="common_more f_18">explore</a>
                    </div>
                </div>
                <div class="flex flex3">
                    <div class="img" aos="scale-opacity">
                        <img src="./images/flex3.png" alt="">
                    </div>
                    <div class="r" aos="scale-opacity">
                        <div class="p1 f_48">Digital Resources</div>
                        <div class="p2 f_24">Based on Microservices Architecture</div>
                        <div class="p3 f_20">
                            Utilizing advanced coding technology, this solution supports the construction of clustered library systems, enabling comprehensive management across multiple libraries.
                        </div>
                        <a href="proInfo.html" class="common_more f_18">explore</a>
                    </div>
                </div>
            </div>
            <div class="section4">
                <div class="title f_48" aos="scale-opacity">Cases</div>
                <div class="content">
                    <div class="item" aos="blur">
                        <div class="img">
                            <img src="./images/in5.png" alt="">
                        </div>
                        <div class="r">
                            <div class="p1 f_36">NLB</div>
                            <div class="p2 f_20">
                                Smartlib Solutions provides the Singapore International Library with multiple sets of intelligent sorting equipment to meet the needs of its different branches. It helps improve the work efficiency of librarians and service quality.
                            </div>
                            <a href="caseInfo.html" class="common_more f_18">explore</a>
                        </div>
                    </div>
                    <div class="item" aos="blur">
                        <div class="img">
                            <img src="./images/in6.png" alt="">
                        </div>
                        <div class="r">
                            <div class="p1 f_36">Shanghai Library East Branch</div>
                            <div class="p2 f_20">
                                Smartlib Solutions is committed to the intelligent construction of the Shanghai Library East Building, deploying intelligent software and hardware equipment, and building an intelligent system worth nearly 10 million Singapore dollars.
                            </div>
                            <a href="caseInfo.html" class="common_more f_18">explore</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="section5">
                <img src="./images/in7.png" class="common_bg" alt="">
                <div class="text" aos="scale-opacity">
                    <div class="p1 f_48">learn more about us</div>
                    <a href="about.html" class="common_more f_18">explore</a>
                </div>
            </div>
        </div>

        <div class="foot">
            <div class="logo">
                <img src="./images/logo.png" alt="">
            </div>
            <div class="d1">
                <div class="l">
                    <div class="item">
                        <p class="p1 f_18">about</p>
                        <div class="aList">
                            <a href="./about.html">Overview</a>
                            <a href="./about.html?id=md1">History</a>
                            <a href="./about.html?id=md2">Client</a>
                        </div>
                    </div>
                    <div class="item">
                        <p class="p1 f_18">products</p>
                        <div class="aList">
                            <a href="./products.html">Hardware</a>
                            <a href="./products.html">Software</a>
                        </div>
                    </div>
                    <div class="item">
                        <p class="p1 f_18">solutions</p>
                        <div class="aList">
                            <a href="./solution_info.html">Smart Library Solutions</a>
                            <a href="./solution_info.html">Automated Book </a>
                            <a href="./solution_info.html">FRID Solutions</a>
                        </div>
                    </div>
                    <div class="item">
                        <p class="p1 f_18">cases</p>
                        <div class="aList">
                            <a href="./cases.html">Public libraries</a>
                            <a href="./cases.html">universities</a>
                            <a href="./cases.html">primary&middle schools</a>
                        </div>
                    </div>
                    <div class="item">
                        <p class="p1 f_18">contact</p>
                        <div class="aList">
                            <a href="./contact.html">Contact us</a>
                        </div>
                    </div>
                </div>
                <div class="r">
                    <p class="p1 f_18">Follow Us</p>
                    <div class="icons">
                        <a href="">
                            <img src="./images/icon1.svg" alt="">
                        </a>
                        <a href="">
                            <img src="./images/icon2.svg" alt="">
                        </a>
                        <a>
                            <img src="./images/icon3.svg" alt="">
                            <div class="code animated fadeIn">
                                <img src="./images/code.png" alt="">
                            </div>
                        </a>
                        <a href="">
                            <img src="./images/icon4.svg" alt="">
                        </a>
                        <a href="">
                            <img src="./images/icon5.svg" alt="">
                        </a>
                        <a href="">
                            <img src="./images/icon6.svg" alt="">
                        </a>
                    </div>
                    <div class="info">
                        E-mail：rfid@sh-rfid.com<br>
                        Tel: +86-21-54262851, 54262853, 54262850<br>
                        Add: No. 810, Yishan Road, Shanghai<br>
                        Hotline: 4000089558
                    </div>
                </div>
            </div>
            <div class="d2">
                <div class="l">
                    © 2024 Zhitu Chuangxiang Co., Ltd. All Rights Reserved
                </div>
                <div class="r">
                    <a href="">Imprint</a>
                    <span></span>
                    <a href="">Privacy Policy</a>
                </div>
            </div>
        </div>



    </div>
    <script src="./js/jquery-3.6.1.min.js"></script>
    <script src="./js/swiper.js"></script>
    <script src="./js/gsap.min.js"></script>
    <script src="./js/ScrollTrigger.min.js"></script>
    <script src="./js/lenis.min.js"></script>
    <script src="./js/aos.js"></script>
    <script src="./js/common.js"></script>
    <script src="./js/swiper.js"></script>
    <script>
        new Swiper('.rSwiper', {
            speed: 1000,
            effect: 'fade',
            loop: true,
            pagination: {
                el: '.section1 .swiper-pagination',
                clickable: true,
            },
            autoplay: {
                delay: 4000,
                disableOnInteraction: false,
            },
            on: {
                slideChange() {
                    $('.main .section1 .display .l .l_list').removeClass('on').eq(this.realIndex).addClass('on')
                }
            }
        })
    </script>
</body>

</html>